<script>
import { listSponsor } from '@/api/system/sponsor';
import { defineComponent, ref,nextTick, onMounted, onBeforeMount } from '@vue/composition-api';
import * as imageConversion from 'image-conversion';
// import { nextTick } from 'vue'

import {
  GetOrgList,
  GetUserList,
  GetUserList1,
  GetTeacherList,
  CreateActivity,
  EditActivity,
  GetActivityDetail,
  listOrg,
  listOrg3,
  getPlaceList
} from '@/api/education';
import { ActivityContentOptions, ActivityTypeOptions, ActivityOptions, sureOption, Activity1Options } from '../enum';
import { MessageBox, Message } from 'element-ui';
import router from '@/router';
import moment from 'moment';
import { GetUrlString } from '@/utils/string';
import processApi from "@/api/workflow/processInst";
import history from "@/components/Process/History";
import verify from "@/components/Process/Verify";

export default defineComponent({
  name: 'CreateActivity',
  components: {
    history,
    verify
  },
  setup() {
    const managerType = ref();
    const activityId = router.history.current.query.activityId;
    const studentId = router.history.current.query.studentId;
    const type = router.history.current.query.type; //1.修改，2.办结
    const uploadFileUrl = process.env.VUE_APP_BASE_API + '/api/images/uploadLocal';
    const loading = ref(false);
    const title = ref('');
    const processInstanceId = ref('');
    const taskVariables = ref({}); //流程变量
    const taskId = ref(); //任务id
    const flag = ref(true);
    const Mform = ref({}); 
    const MList = ref([]); 
    const open = ref(false);
    const sendMessage = ref({}); //消息提醒
    const processKey = ref('activity');
    const formRef = ref();
    const formModel = ref({
      activityName: null,
      activityContent: null,
      hostOrgId: null,
      cooperativeUnitName: null,
      activityStartTime: null,
      activityEndTime: null,
      position: null,
      txt: null,
      postId: null,
      size: null,
      adminId: null,
      adminId2: null,
      adminPhone: null,
      adminPhone2: null,
      remark: null,
      mark: null,
      applyCount: null,
      applyEndTime: null,
      siteId:null,
      activityRank:null,
      activityGrade:null,
      isNeedSignOut:null
    });
    const formRule = ref({
      activityName: [{ required: true, message: '请输入活动名称', trigger: 'blur' }],
      activityRank: [{ required: true, message: '请选择活动级别', trigger: 'blur' }],
      activityGrade: [{ required: true, message: '请选择活动等级', trigger: 'blur' }],
      isNeedSignOut: [{ required: true, message: '请选择是否需要签退', trigger: 'blur' }],
      activityContent: [{ required: true, message: '请选择活动类型', trigger: 'change' }],
      activityType: [{ required: true, message: '请选择活动内容', trigger: 'change' }],
      hostOrgId: [{ required: true, message: '请选择主办单位', trigger: 'change' }],
      cooperativeUnitName: [{ required: true, message: '请选择协办单位', trigger: 'change' }],
      activityStartTime: [{ required: true, message: '选择活动开始时间', trigger: 'change' }],
      activityEndTime: [{ required: true, message: '活动结束时间', trigger: 'change' }],
      position: [{ required: true, message: '请输入活动地点', trigger: 'blur' }],
      txt: [{ required: true, message: '请输入活动介绍', trigger: 'blur' }],
      mark: [{ required: true, message: '学分不能为空', trigger: 'blur' }],
      // postId: [{ required: true, message: '活动海报不能为空', trigger: 'blur' }],
      size: [{ required: true, message: '请输入预估活动规模', trigger: 'blur' }],
      adminId: [{ required: true, message: '请选择管理员', trigger: 'change' }],
      adminPhone: [
        { required: true, message: '请输入管理员电话', trigger: 'blur' },
        // {
        //   pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
        //   message: '请输入正确的手机号码',
        //   trigger: 'blur',
        // },
      ],
      applyCount: [{ required: true, message: '请输入最大报名人数', trigger: 'blur' }],
      applyEndTime: [{ required: true, message: '选择报名截止时间', trigger: 'change' }],
      // siteId: [{ required: true, message: '选上传场地审批单', trigger: 'blur' }],
      over: [{ required: true, message: '选上传办结文件', trigger: 'blur' }],
    });

    const hostList = ref([]); //主办单位列表
    const placeList = ref([]); //主办单位列表

    const limitDialog = ref(false);
    const limitType = ref(0);
    const dynamicTags = ref([]);
    const searchOrgList = ref([]);
    const inputValue = ref('');
    /** 限制弹框 */
    const handleLimit = type => {
      const typeArr = ['班级', '年级', '系部', '学生组织'];
      searchOrgList.value = [];
      limitDialog.value = true;
      // recordData.value = record;
      title.value = typeArr[type];
      limitType.value = type;
      inputValue.value = '';
      // switch (type) {
      //   case 0:
      //     dynamicTags.value = formModel.value.majorsRestricted;
      //     break;
      //   case 1:
      //     dynamicTags.value = formModel.value.gradeRestricted;
      //     break;
      //   case 2:
      //     dynamicTags.value = formModel.value.unitRestricted;
      //     break;
      //   case 3:
      //     dynamicTags.value = formModel.value.stuOrgRestricted;
      //     break;
      // }
    };
    const getOrgIdList = orgName => {
      console.log(orgName, 'LIst');
      if (orgName !== '') {
        loading.value = true;
        const queryParams = {
          pageNum: 1,
          pageSize: 30,
          type: limitType.value + 1,
          orgName: orgName,
        };
        if (limitType.value != 3) {
          listOrg(queryParams).then(response => {
            searchOrgList.value = response.rows;
            loading.value = false;
          });
        } else {
          queryParams.type = null;
          listOrg3(queryParams).then(response => {
            searchOrgList.value = response.rows;
            loading.value = false;
          });
        }
      } else {
        searchOrgList.value = [];
      }
    };
    const handleClose = tag => {
      // dynamicTags.value.splice(dynamicTags.value.indexOf(tag), 1);
      switch (limitType.value) {
        case 0:
          formModel.value.majorsRestricted.splice(formModel.value.majorsRestricted.indexOf(tag), 1);
          break;
        case 1:
          formModel.value.gradeRestricted.splice(formModel.value.gradeRestricted.indexOf(tag), 1);
          break;
        case 2:
          formModel.value.unitRestricted.splice(formModel.value.unitRestricted.indexOf(tag), 1);
          formModel.value.unitRestrictedName.splice(
            formModel.value.unitRestrictedName.indexOf(tag),
            1
          );
          break;
        case 3:
          formModel.value.stuOrgRestricted.splice(formModel.value.stuOrgRestricted.indexOf(tag), 1);
          formModel.value.stuOrgRestrictedName.splice(
            formModel.value.stuOrgRestrictedName.indexOf(tag),
            1
          );
          break;
      }
    };

    const handleInputConfirm = item => {
      console.log(item, 'item');
      // let inputValue = this.inputValue;
      if (inputValue) {
        // dynamicTags.value.push(inputValue.value);
        switch (limitType.value) {
          case 0:
            formModel.value.majorsRestricted.push(inputValue.value);
            break;
          case 1:
            formModel.value.gradeRestricted.push(inputValue.value);
            break;
          case 2:
            formModel.value.unitRestricted.push(item.sponsorCode);
            formModel.value.unitRestrictedName.push(item.sponsorName);
            break;
          case 3:
            formModel.value.stuOrgRestricted.push(item.orgId);
            formModel.value.stuOrgRestrictedName.push(item.orgName);
            break;
        }
      }
      inputValue.value = '';
    };

    const searchHost = async query => {
      loading.value = true;
      const payload = {
        studentId: studentId.value == 'admin' ? '' : studentId.value,
        unitName: query,
        userType: 1,
        pageSize: 99,
        pageNum: 1,
      };
      const response = await listSponsor(payload);
      loading.value = false;
      if (response.code === 200) {
        hostList.value = response.rows;
        // console.log(hostList.value);
      }
    };
    const cooperativeUnitList = ref([]); //协办单位列表

    const searchCooperative = async query => {
      loading.value = true;
      // console.log(formModel.value.hostOrgId, query, '111');
      const payload = {
        orgName: query,
        pageSize: 99,
        pageNum: 1,
      };
      const response = await GetOrgList(payload);
      loading.value = false;
      if (response.code === 200) {
        cooperativeUnitList.value = response.rows;
        // console.log(cooperativeUnitList.value);
      }
    };

    const userList = ref([]); //管理员列表
    const userList1 = ref([]); //管理员列表

    const searchUser = async query => {
      loading.value = true;
      const payload = {
        keyword: query,
        pageSize: 99,
        pageNum: 1,
      };
      const response = await GetUserList(query);
      loading.value = false;
      if (response.code === 200) {
        // const res = new Map();
        // userList.value = response.rows.filter((response.rows) => !res.has(response.rows.unitName) && res.set(response.rows.unitName,1));
        userList.value = response.rows;
      }
    };
    const searchUser1 = async query => {
      loading.value = true;
      const payload = {
        keyword: query,
        pageSize: 99,
        pageNum: 1,
      };
      const response = await GetUserList1(query);
      loading.value = false;
      if (response.code === 200) {
        // const res = new Map();
        // userList.value = response.rows.filter((response.rows) => !res.has(response.rows.unitName) && res.set(response.rows.unitName,1));
        userList1.value = response.rows;
      }
    };
    const changeAdmin = async (query, type) => {
      console.log(query, type, "**********************")
      if (type == 1) {
        // formModel.value.adminId = query.value;
        formModel.value.adminPhone = query.phonenumber;
      } else {
        // formModel.value.adminId2 = query.value;
        formModel.value.adminPhone2 = query.phonenumber;
      }
    };
    const teacherList = ref([]); //老师列表

    const searchTea = async query => {
      loading.value = true;
      const payload = {
        keyword: query,
        pageSize: 99,
        pageNum: 1,
      };
      const response = await GetTeacherList(query);
      loading.value = false;
      console.log(response);
      if (response.code === 200) {
        // const res = new Map();
        // userList.value = response.rows.filter((response.rows) => !res.has(response.rows.unitName) && res.set(response.rows.unitName,1));
        teacherList.value = response.rows;
      }
    };

    const goBack = () => {
      router.go(-1);
    };

    // 判断日期前后
    const changeDate1 = () => {
      if (
        formModel.value.activityEndTime != null &&
        formModel.value.activityEndTime != '' &&
        formModel.value.activityEndTime != undefined
      ) {
        console.log(formModel.value.activityStartTime, formModel.value.activityEndTime, 'time');
        if (formModel.value.activityStartTime > formModel.value.activityEndTime) {
          // || formModel.value.activityEndTime.includes(formModel.value.activityStartTime)
          Message.error({
            message: '活动结束时间需大于等于活动开始时间',
          });
          formModel.value.activityEndTime = '';
        } else {
          console.log(222);
        }
      }
      if (
        formModel.value.applyEndTime != null &&
        formModel.value.applyEndTime != '' &&
        formModel.value.applyEndTime != undefined
      ) {
        console.log(formModel.value.activityStartTime, formModel.value.applyEndTime, 'time');
        if (formModel.value.activityStartTime < formModel.value.applyEndTime) {
          Message.error({
            message: '活动开始时间时间需大于等于报名截止',
          });
          formModel.value.applyEndTime = '';
        } else {
          console.log(222);
        }
      }
    };
    const verifyRef = ref([]);
    //提交流程
    const submitFormApply = (entity) => {
      let assigneeList = []
      assigneeList.push(1)
      assigneeList.push(2)
      //流程变量
      taskVariables.value = {
        entity: entity,
        userId: '1',
        //assigneeList: assigneeList
      }
      const data = {
        processKey: processKey.value, // key
        businessKey: entity.activityId, // 业务id
        variables: taskVariables.value,
        classFullName: 'com.ruoyi.committee.domain.ActivityBase'
      }
      // 启动流程
      processApi.startProcessApply(data).then(response => {
        // verifyRef.value.reset()
      })
    };
    const handleSubmit = (formEl, isSubmit) => {
      formModel.value.activityStudentManagerIdList = MList.value
      formEl.validate(async valid => {
        if (valid) {
          loading.value = true;
          const { activityStartTime, activityEndTime, applyEndTime } = formModel.value;
          if (formModel.value.postId && formModel.value.postId.indexOf('?') != -1) {
            let obj = {};
            let arr = formModel.value.postId
              .slice(formModel.value.postId.indexOf('?') + 1)
              .split('&');
            arr.forEach(item => {
              let param = item.split('=');
              obj[param[0]] = param[1];
            });
            formModel.value.postId = obj.name;
          }
          // if (formModel.value.adminId && formModel.value.adminId.indexOf('-') != -1) {
          //   formModel.value.adminId = formModel.value.adminId.substring(
          //     formModel.value.adminId.lastIndexOf('-') + 1
          //   );
          //   console.log(formModel.value.adminId, '111');
          //   // formModel.value.postId = obj.name;
          // }
          // if (formModel.value.adminId2 && formModel.value.adminId2.indexOf('-') != -1) {
          //   formModel.value.adminId2 = formModel.value.adminId2.substring(
          //     formModel.value.adminId2.lastIndexOf('-') + 1
          //   );
          // }
          if (formModel.value.person && formModel.value.person.indexOf('-') != -1) {
            formModel.value.person = formModel.value.person.substring(
              formModel.value.person.lastIndexOf('-') + 1
            );
            // console.log(formModel.value.person, '111');
            // formModel.value.postId = obj.name;
          }
          if (formModel.value.personTeacher && formModel.value.personTeacher.indexOf('-') != -1) {
            formModel.value.personTeacher = formModel.value.personTeacher.substring(
              formModel.value.personTeacher.lastIndexOf('-') + 1
            );
          }
          formModel.value.adminId = formModel.value.adminId?formModel.value.adminId.value:null;
          formModel.value.adminId2 = formModel.value.adminId2?formModel.value.adminId2.value:null;
          const payload = {
            ...formModel.value,
            activityType:2,
            activityStartTime: moment(activityStartTime).format('YYYY-MM-DD HH:mm:ss'),
            activityEndTime: moment(activityEndTime).format('YYYY-MM-DD HH:mm:ss'),
            applyEndTime: moment(applyEndTime).format('YYYY-MM-DD HH:mm:ss'),
          };
          // console.log(payload);
          // return;
          if (activityId) {
            payload.activityId = activityId;
            if (isSubmit == 2) {
              if (type == 1) {
                payload.activityStatus = payload.chair ? '0' : '2';
              } else {
                payload.activityStatus = '4'; //type,//1.修改，2.办结
              }
            }
          } else {
            if (isSubmit == 1) {
              //isSubmit是否提交，1.保存，2.提交
              payload.activityStatus = '-1';
            } else {
              console.log(!!payload.chair)
              payload.activityStatus = payload.chair ? '0' : '2';
            }
          }
          console.log(payload);
          // const response = await CreateActivity(payload);
          const response = activityId ? await EditActivity(payload) : await CreateActivity(payload);
          loading.value = false;
          if (response.code === 200) {
            // taskId.value = response.data.taskId?response.data.taskId:null;
            if (isSubmit == 1) {
              Message({
                message: '活动保存成功',
                type: 'success',
              });
              goBack();
            } else if (activityId) {
              Message({
                message: '活动修改成功',
                type: 'success',
              });
              goBack();
            } else {
              verifyRef.value.visible = true
              Message({
                message: '活动创建成功',
                type: 'success',
              });
              goBack();
            }
          } else {
            Message.error({
              message: response.msg,
            });
          }
        } else {
          Message.error({
            message: '请填写完整的活动信息',
          });
        }
      });
    };

    const postIdFileList = ref([]);

    const changePostIdImage = (file, fileList) => {
      console.log(file.code);
      if (file.status === 'success') {
        formModel.value.postId = file.response.data.url;
        postIdFileList.value = fileList;
      }
    };
    const removePostIdImage = () => {
      formModel.value.postId = null;
      postIdFileList.value = [];
    };

    const securityFileList = ref([]);


    // 图片压缩
    const uploadContractFun = (file) => {
      return new Promise((resolve, reject) => {
        //项目要求是大于5MB的图片进行压缩，可根据项目情况自行判断
        if (file.size > 60 * 1024) {
          // console.log('压缩前', file) // 压缩到400KB
          imageConversion.compressAccurately(file, 50).then(res => {
            res = new File([res], file.name, { type: res.type, lastModified: Date.now() })
            resolve(res)
          })
        } else {
          resolve(file)
        }
      })
    };
    const changeSecurityImage = (file, fileList) => {
      if (file.status === 'success') {
        formModel.value.security = file.response.data.url;
        securityFileList.value = fileList;
      }
    };
    const removeSecurityImage = () => {
      formModel.value.security = null;
      securityFileList.value = [];
    };

    const chairFileList = ref([]);

    const changeChairImage = (file, fileList) => {
      if (file.status === 'success') {
        formModel.value.chair = file.response.data.url;
        chairFileList.value = fileList;
      }
    };
    const removeChairImage = () => {
      formModel.value.chair = null;
      chairFileList.value = [];
    };

    const materialsFileList = ref([]);

    const changeMaterialsImage = (file, fileList) => {
      if (file.status === 'success') {
        formModel.value.materials = file.response.data.url;
        materialsFileList.value = fileList;
      }
    };
    const removeMaterialsImage = () => {
      formModel.value.materials = null;
      materialsFileList.value = [];
    };

    const placeFileList = ref([]);


    const overFileList = ref([]);
    const changeOverImage = (file, fileList) => {
      console.log(file.code);
      if (file.status === 'success') {
        formModel.value.over = file.response.data.url;
        overFileList.value = fileList;
      }
    };
    const removeOverImage = () => {
      formModel.value.over = null;
      overFileList.value = [];
    };
    const handleUploadSuccess = res => {
      console.log(res, 'resssss');
      if (res.code == 200) {
        Message({
          message: '上传成功',
          type: 'success',
        });
      } else {
        Message.error({
          message: '上传失败',
        });
      }
    };

    const handleUploadError = () => {
      Message.error({
        message: '上传失败',
      });
    };

    const getActivityDetail = async () => {
      console.log(managerType.value, "managerType.value")
      const response = await GetActivityDetail(activityId);
      if (response.code === 200) {
        formModel.value = response.data;
        MList.value = JSON.parse(JSON.stringify(response.data.activityStudentManagerIdList))
        console.log(MList.value,'2222222222222222222222222222222222');
        nextTick(() => {
          console.log("111")
          processInstanceId.value = response.data.actBusinessStatus.processInstanceId;
        })
        formModel.value.majorsRestricted = formModel.value.majorsRestricted
          ? formModel.value.majorsRestricted.split(',')
          : [];
        formModel.value.gradeRestricted = formModel.value.gradeRestricted
          ? formModel.value.gradeRestricted.split(',')
          : [];
        formModel.value.unitRestricted = formModel.value.unitRestricted
          ? formModel.value.unitRestricted.split(',')
          : []; //学院限制
        formModel.value.unitRestrictedName = formModel.value.unitRestrictedName
          ? formModel.value.unitRestrictedName.split(',')
          : [];
        formModel.value.stuOrgRestricted = formModel.value.stuOrgRestricted
          ? formModel.value.stuOrgRestricted.split(',')
          : [];
        formModel.value.stuOrgRestrictedName = formModel.value.stuOrgRestrictedName
          ? formModel.value.stuOrgRestrictedName.split(',')
          : [];
        const {
          hostName,
          cooperativeUnitName,
          adminId,
          postId,
          security,
          chair,
          materials,
          over,
        } = response.data;
        searchHost(hostName);
        searchCooperative(cooperativeUnitName);
        searchUser(adminId);
        // searchUser(adminId2);
        postIdFileList.value = postId ? [{ name: GetUrlString(postId, 'name'), url: postId }] : [];
        securityFileList.value = security ? [{ name: security, url: security }] : [];
        chairFileList.value = chair ? [{ name: chair, url: chair }] : [];
        materialsFileList.value = materials ? [{ name: materials, url: materials }] : [];
        // placeFileList.value = place ? [{ name: place, url: place }] : [];
        overFileList.value = over ? [{ name: over, url: over }] : [];
      }
    };
    const getPlace = async()=>{
      const response = await getPlaceList()
      if(response.code == 200){
        placeList.value = response.rows
      }
      // console.log(response,'22222222222222222222222222222');
    }
    const addManage = () =>{
      open.value = true
    }
    const AddList = () =>{
        MList.value.push(Mform.value.activityStudentManagerId)
        Mform.value.activityStudentManagerId = ''
        userList1.value = []
    }
    
    const delManage = (row) =>{
      console.log(row);
      
      var arr = MList.value.find((item,index)=>{
        return item.value == row.value
      })
      console.log(arr);
      MList.value.splice(arr,1)
    }
    onMounted(() => {
      // loadData();
      getPlace()
    });
    onBeforeMount(() => {
      searchHost();
      searchCooperative();
      searchUser();
      managerType.value = router.history.current.query.managerType;
      // console.log(managerType.value, 'managerType.value')
      if (activityId) {
        console.log(activityId, "activity")
        getActivityDetail();
      }
    });

    return {
      verifyRef,
      getPlace,
      submitFormApply,
      managerType,
      type,
      formRef,
      formModel,
      formRule,
      loading,
      limitDialog,
      handleLimit,
      getOrgIdList,
      handleClose,
      handleInputConfirm,
      limitType,
      dynamicTags,
      searchOrgList,
      inputValue,
      title,
      processInstanceId,
      taskVariables, //流程变量
      taskId, //任务id
      flag,// 消息提醒
      sendMessage,
      processKey,
      ActivityContentOptions,
      ActivityTypeOptions,
      hostList,
      cooperativeUnitList,
      searchHost,
      searchCooperative,
      userList,
      userList1,
      teacherList,
      searchUser,
      searchUser1,
      changeAdmin,
      searchTea,
      uploadFileUrl,
      goBack,
      Mform,
      delManage,
      addManage,
      AddList,
      MList,
      open,
      changeDate1,
      handleSubmit,
      postIdFileList,
      changePostIdImage,
      removePostIdImage,
      handleUploadError,
      handleUploadSuccess,
      securityFileList,
      uploadContractFun,
      changeSecurityImage,
      removeSecurityImage,
      chairFileList,
      changeChairImage,
      removeChairImage,
      materialsFileList,
      changeMaterialsImage,
      removeMaterialsImage,
      placeFileList,
      overFileList,
      changeOverImage,
      removeOverImage,
      placeList,//场地列表
      ActivityOptions,
      Activity1Options,
      sureOption
    };
  },
});
</script>

<template>
  <div class="app-container">
    <!-- <el-tabs type="border-card">
      <el-tab-pane label="活动信息" v-loading="loading"> -->
        <el-row>
          <el-form ref="formRef" :model="formModel" :rules="formRule" label-width="130px">
            <el-row :gutter="24">
              <el-col :span="8">
                <el-form-item label="活动名称" prop="activityName">
                  <el-input :disabled="type == 2" v-model="formModel.activityName" placeholder="请输入活动名称" />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="活动类型" prop="activityContent">
                  <el-select v-model="formModel.activityContent" placeholder="请选择活动类型" style="width: 100%"
                    :disabled="type == 2">
                    <el-option v-for="item in ActivityContentOptions" :key="item.value" :label="item.label"
                      :value="item.value" />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="主办单位" prop="hostOrgId">
                  <el-select v-model="formModel.hostOrgId" placeholder="请输入名称搜索主办单位" :loading="loading"
                    :remote-method="searchHost" filterable clearable remote style="width: 100%" :disabled="type == 2">
                    <!-- @change="searchCooperative" -->
                    <el-option v-for="item in hostList" :key="item.sponsorCode" :label="item.sponsorName"
                      :value="item.sponsorCode" />
                  </el-select>
                </el-form-item>
              </el-col>
              <!-- <el-col :span="6">
                <el-form-item label="学分" prop="mark">
                  <el-input v-model="formModel.mark" placeholder="请输入学分" />
                </el-form-item>
              </el-col> -->
            </el-row>
            <el-row :gutter="24">
              <el-col :span="8">
                <el-form-item label="活动级别" prop="activityRank">
                  <el-select v-model="formModel.activityRank" placeholder="请选择类型">
                    <el-option v-for="item in Activity1Options" :key="item.value" :label="item.label" :value="item.value" />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="活动等级" prop="activityGrade">
                  <el-select v-model="formModel.activityGrade" placeholder="请选择类型">
                    <el-option v-for="item in ActivityOptions" :key="item.value" :label="item.label" :value="item.value" />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="是否需要签退" prop="isNeedSignOut">
                  <el-select v-model="formModel.isNeedSignOut" placeholder="请选择类型">
                    <el-option v-for="item in sureOption" :key="item.value" :label="item.label" :value="item.value" />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item label="活动开始时间" prop="activityStartTime">
                  <el-date-picker v-model="formModel.activityStartTime" type="datetime" @change="changeDate1"
                    placeholder="选择活动开始时间" style="width: 100%" :disabled="type == 2" />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="活动结束时间" prop="activityEndTime">
                  <el-date-picker v-model="formModel.activityEndTime" type="datetime" @change="changeDate1"
                    placeholder="选择活动结束时间" style="width: 100%" :disabled="type == 2" />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="24">
                <el-form-item label="活动地点" prop="position">
                  <el-input :disabled="type == 2" v-model="formModel.position" placeholder="请输入活动地点" />
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="活动介绍" prop="txt">
                  <el-input :disabled="type == 2" v-model="formModel.txt" placeholder="需填写活动发起人联系方式或活动咨询群" type="textarea"
                    :rows="2" />
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="海报" prop="postId">
                  <el-upload :disabled="type == 2" :action="uploadFileUrl" :limit="1" list-type="picture"
                    :on-change="changePostIdImage" :on-remove="removePostIdImage" :on-error="handleUploadError"
                    :on-success="handleUploadSuccess" :file-list="postIdFileList" :before-upload="uploadContractFun">
                    <el-button size="small" type="primary">点击上传</el-button><span style="color: #999">
                      图片推荐分辨率886*1200，等比例放大缩小</span>
                  </el-upload>
                </el-form-item>
              </el-col>
              <!-- <el-col :span="8">
                <el-form-item label="预估活动规模" prop="size">
                  <el-input :disabled="type == 2" v-model="formModel.size" placeholder="请输入预估活动规模" />
                </el-form-item>
              </el-col> -->
              <el-col :span="12">
                <el-col :span="14">
                  <el-form-item label="管理员1" label-width="120px" prop="adminId">
                    <el-select prop="adminId" :disabled="type == 2" v-model="formModel.adminId" value-key="value" placeholder="学号或姓名搜索"
                      :loading="loading" :remote-method="searchUser" @change="changeAdmin($event, 1)" filterable remote style="width: 100%">
                      <el-option v-for="item in userList" :key="item.value" :label="item.label" :value="item" />
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="10">
                  <el-form-item label-width="0px" prop="adminPhone">
                    <el-input prop="adminPhone" :disabled="type == 2" v-model="formModel.adminPhone"
                      placeholder="请输入电话" />
                  </el-form-item>
                </el-col>
              </el-col>
              <el-col :span="12">
                <el-form-item label="管理员2" label-width="70px" prop="adminId2">
                  <el-col :span="12">
                    <el-select :disabled="type == 2" v-model="formModel.adminId2" value-key="value" placeholder="学号或姓名搜索" :loading="loading"
                      :remote-method="searchUser" @change="changeAdmin($event, 2)" filterable remote style="width: 100%">
                      <el-option v-for="item in userList" :key="item.value" :label="item.label" :value="item" />
                    </el-select>
                  </el-col>
                  <el-col :span="12">
                    <el-input :disabled="type == 2" v-model="formModel.adminPhone2" placeholder="请输入电话" />
                  </el-col>
                </el-form-item>
              </el-col>
              <!-- <el-col :span="8">
            <el-form-item label="预申报积分" prop="mark">
              <el-input v-model="formModel.mark" placeholder="请输入预申报积分" />
            </el-form-item>
          </el-col> -->
              <!-- <el-col :span="24">
                <el-form-item label="报备信息" prop="remark">
                  <el-input :disabled="type == 2" v-model="formModel.remark" placeholder="请输入报备信息" type="textarea"
                    :rows="2" />
                </el-form-item>
              </el-col> -->
              <el-col :span="8">
                <el-form-item label="二维码管理员" prop="activityStudentManagerId">
                  <el-button size="small" type="primary" @click="addManage">添加管理员</el-button>
                  <el-button size="small" type="primary" @click="addManage">管理员列表</el-button>
                  <!-- <el-select :disabled="type == 2" v-model="formModel.activityStudentManagerId" value-key="value" placeholder="学号或姓名搜索"
                      :loading="loading"  :remote-method="searchUser1" filterable remote
                      style="width: 100%">
                      <el-option v-for="item in userList1" :key="item.value" :label="item.label" :value="item.value" />
                    </el-select> -->
                </el-form-item>
          </el-col>
              <el-col :span="8">
                <el-form-item label="最大报名人数" prop="applyCount">
                  <el-input :disabled="type == 2" v-model="formModel.applyCount" placeholder="请输入最大报名人数" />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="报名截止时间" prop="applyEndTime">
                  <el-date-picker :disabled="type == 2" v-model="formModel.applyEndTime" @change="changeDate1"
                    type="datetime" placeholder="选择报名截止时间" style="width: 100%" />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="12">
              <el-col :span="12">
                <el-form-item label="场地审批" prop="siteId">
                  <el-select v-model="formModel.siteId" placeholder="请输入名称搜索主办单位" :loading="loading"
                  filterable clearable remote style="width: 100%">
                    <el-option v-for="item in placeList" :key="item.siteId" :label="item.siteName"
                      :value="item.siteId" />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </el-row>
        <el-row style="padding-left: 130px">
          <el-button type="primary" @click="handleSubmit(formRef, 2)">提交</el-button>
          <el-button @click="goBack">取消</el-button>
        </el-row>
        <el-dialog title="二维码管理员列表" :visible.sync="open" width="650px" append-to-body>
          <!-- <el-form :model="Mform"> -->
            <!-- <el-form-item label="查询" width="180"> -->
              <div style="display: flex;margin-bottom: 20px;">
                <div>
                  <el-select  v-model="Mform.activityStudentManagerId" value-key="value" placeholder="学号或姓名搜索"
                      :loading="loading"  :remote-method="searchUser1" filterable remote
                      style="width: 100%">
                      <el-option v-for="item in userList1" :key="item.value" :label="item.label" :value="item" />
                    </el-select>
                </div>
                <div style="margin-left: 40px;">
                  <el-button type="primary" @click="AddList" :disabled="!Mform.activityStudentManagerId">添加</el-button>
                </div>
              </div>
            <!-- </el-form-item> -->
          <!-- </el-form> -->
          <el-table
            v-loading="loading"
            :data="MList"
          >
            <el-table-column label="姓名" align="center" prop="nickName" width="180"/>
            <el-table-column label="学号" align="center" prop="value"/>
            <el-table-column label="操作" align="center" prop="username">
              <template slot-scope="scope">
                <el-button type='danger' @click="delManage(scope.row)">删除</el-button>
              </template>
              </el-table-column>
          </el-table>
          <div slot="footer" class="dialog-footer">
            <!-- <el-button @click="cancleAct">取 消</el-button>
            <el-button type="primary" @click="sureAdd">确 定</el-button> -->
          </div>
        </el-dialog>
      <!-- </el-tab-pane>
      <el-tab-pane label="审批历史" v-if="processInstanceId">
        <history ref="historyRef" :processInstanceId="processInstanceId"></history>
      </el-tab-pane>
    </el-tabs> -->

    <!-- 提交 -->
    <!-- <verify ref="verifyRef" @submitCallback="goBack" :taskId="taskId" :taskVariables="taskVariables"
      :sendMessage="sendMessage"></verify> -->
    <!-- 弹框 -->
  </div>
</template>
<style scoped></style>
